<!doctype html>
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<script src="../../../editing/assert_selection.js"></script>
<script>
function selectInElement(document, element) {
  eventSender.mouseMoveTo(document.offsetLeft + element.offsetLeft + 2,
                          document.offsetTop + element.offsetTop +
                              element.offsetHeight / 2);
  eventSender.mouseDown();
  eventSender.mouseMoveTo(document.offsetLeft + element.offsetLeft +
                              element.offsetWidth - 2,
                          document.offsetTop + element.offsetTop +
                              element.offsetHeight / 2);
  eventSender.mouseUp();
}

test(() => {
  assert_not_equals(window.eventSender, undefined,
    'This test requires eventSender.');

  assert_selection(
    [
        '<div>',
        '  <div id="host"></div>',
        '</div>',
    ].join('\n'),
    selection => {
      const document = selection.document;
      const host = document.getElementById('host');
      const shadowRoot1 = host.attachShadow({mode: 'open'});
      shadowRoot1.innerHTML = '<div id="target">abc</div>';
      const target = shadowRoot1.getElementById('target');

      selectInElement(document, target);
      host.remove();
    },
    [
        '<div>',
        '  |',
        '</div>',
    ].join('\n'),
    {dumpAs: 'flattree'});
}, 'Remove shadow host containing selection');

test(() => {
  assert_not_equals(window.eventSender, undefined,
    'This test requires eventSender.');

  assert_selection(
    [
        '<div>',
        '  <div id="host"></div>',
        '</div>',
    ].join('\n'),
    selection => {
      const document = selection.document;
      const host = document.getElementById('host');
      const shadowRoot1 = host.attachShadow({mode: 'open'});
      shadowRoot1.innerHTML = '<div id="host2"></div>';
      const host2 = shadowRoot1.getElementById('host2');
      const shadowRoot2 = host2.attachShadow({mode: 'open'});
      shadowRoot2.innerHTML = '<div id="target">abc</div>';
      const target = shadowRoot2.getElementById('target');

      selectInElement(document, target);
      host.remove();
    },
    [
        '<div>',
        '  |',
        '</div>',
    ].join('\n'),
    {dumpAs: 'flattree'});
}, 'Remove shadow host containing selection in nested shadow tree');
</script>
